<!-- base.html -->
{% block load %}
    {% load i18n static simpletags %}
      {% load bootstrap4 %}

    {# Load CSS and JavaScript #}
    {% bootstrap_css %}
    {% bootstrap_javascript jquery='full' %}

    {# Display django.contrib.messages as Bootstrap alerts #}
    {% bootstrap_messages %}
{% endblock %}
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8"/>
    <title> {% block title %}{% translate "呼吸道疾病智能诊断系统" %} {% endblock %}</title>
    <meta name="author" content="magic"/>
	<link rel="icon" href="{% static 'account/images/favicon.png' %}">

    {% block link_css %}
        <link rel="stylesheet" href="https://unpkg.com/tailwindcss@2.2.19/dist/tailwind.min.css"/>{% endblock %}
    <!--Replace with your tailwind.css once created-->
    <style>
        pre {
            white-space: pre-wrap;
        {#设置自动换行，但保留空白#}
        }
        body {
            background-color: #FFFFFF;
        }
        { % block style % }

        { %  endblock  %  }
    </style>
</head>

{% block body %}

    <body class=" font-sans leading-normal tracking-normal">{% endblock %}

<!--nav-->
<nav id="header" class="fixed w-full z-10 top-0 bg-white  rounded">


    <div class="w-full md:max-w-4xl mx-auto flex flex-wrap items-center justify-between mt-0 py-3">

        <div class="pl-4">
            <a class="text-gray-900 text-base no-underline hover:no-underline font-extrabold text-xl" href="/">
                {% translate "呼吸道疾病智能辅助诊断系统" %}
            </a>
        </div>


        <div class="" id="nav-content">
            <ul class="list-reset lg:flex justify-end flex-1 items-center">

                {% if user.is_authenticated %}
                    <li class="mr-3">
                        <a class="inline-block px-6 py-2.5 bg-translateparent text-blue-600 font-medium text-xs leading-tight uppercase rounded hover:bg-gray-100 focus:text-blue-700 focus:bg-gray-100 focus:outline-none focus:ring-0 active:bg-gray-200 active:text-blue-800 translateition duration-300 ease-in-out"
                           href="{% url 'userprofile:profile' %}">{{ user.username }}</a>
                    </li>
                    <li class="mr-3">
                        <a class="inline-block px-6 py-2.5 bg-translateparent text-blue-600 font-medium text-xs leading-tight uppercase rounded hover:bg-gray-100 focus:text-blue-700 focus:bg-gray-100 focus:outline-none focus:ring-0 active:bg-gray-200 active:text-blue-800 translateition duration-300 ease-in-out"
                           href="{% url 'account_logout' %}">{% translate "Logout" %}</a>
                    </li>
                {% else %}
                    <li class="mr-3">
                        <span class="inline-block py-2 px-4 text-gray-900 font-bold "
                              href="">{% translate "You haven't logged" %}</span>
                    </li>
                    <li class="mr-3">
                        <a class="inline-block px-6 py-2.5 bg-translateparent text-blue-600 font-medium text-xs leading-tight uppercase rounded hover:bg-gray-100 focus:text-blue-700 focus:bg-gray-100 focus:outline-none focus:ring-0 active:bg-gray-200 active:text-blue-800 translateition duration-300 ease-in-out"
                           href="{% url 'account_signup' %}">{% translate "register" %}</a>
                    </li>
                    <li class="mr-3">
                        <a class="inline-block px-6 py-2.5 bg-translateparent text-blue-600 font-medium text-xs leading-tight uppercase rounded hover:bg-gray-100 focus:text-blue-700 focus:bg-gray-100 focus:outline-none focus:ring-0 active:bg-gray-200 active:text-blue-800 translateition duration-300 ease-in-out"
                           href="{% url 'account_login' %}">{% translate "Sign in" %}</a>
                    </li>

                {% endif %}
            </ul>
        </div>
    </div>
</nav>


{% block content %}
{% endblock %}
<!--introduce-->


<!--footer-->
{#	<footer class="bg-white  border-gray-400 shadow">#}
{#		<div class="container max-w-4xl mx-auto flex py-8">#}
{##}
{#			<div class="w-full mx-auto flex flex-wrap">#}
{#				<div class="flex w-full md:w-1/2 ">#}
{#					<div class="px-8">#}
{#						<h3 class="font-bold text-gray-900">information  center</h3>#}
{#						<p class="py-4 text-gray-600 text-sm">#}
{#							关于系统更多资讯...#}
{#						</p>#}
{#					</div>#}
{#				</div>#}
{##}
{#				<div class="flex w-full md:w-1/2">#}
{#					<div class="px-8">#}
{#						<h3 class="font-bold text-gray-900">About us</h3>#}
{#						<ul class="list-reset items-center text-sm pt-3">#}
{#							<li>#}
{#								<a class="inline-block text-gray-600 no-underline hover:text-gray-900 hover:text-underline py-1" href="#">关于我们</a>#}
{#							</li>#}
{#							<li>#}
{#								<a class="inline-block text-gray-600 no-underline hover:text-gray-900 hover:text-underline py-1" href="#">招贤纳士</a>#}
{#							</li>#}
{#							<li>#}
{#								<a class="inline-block text-gray-600 no-underline hover:text-gray-900 hover:text-underline py-1" href="#">商务合作</a>#}
{#							</li>#}
{#						</ul>#}
{#					</div>#}
{#				</div>#}
{#			</div>#}
{##}
{##}
{#		</div>#}
{#	</footer>#}

{#  set language  #}
<div class="fixed bottom-0 right-0 mb-3 xl:w-96">
    <form method="POST" action="{% url "set_language" %}" class="my-2  p-1 flex   rounded svelte-1l8159u">
        {% csrf_token %}
        <input type="hidden" name="next" value="{{ redirect_to }}"/>

        <select name="language" class="form-select form-select-sm
    appearance-none
    block
    w-full
    px-2
    py-1
    text-sm
    font-normal
    text-gray-700
    bg-white bg-clip-padding bg-no-repeat
    border border-solid border-gray-300
    rounded
    transition
    ease-in-out
    m-0
    focus:text-gray-700 focus:bg-blue focus:border-blue-600 focus:outline-none">
            {# 得到当前语言#}
            {% get_current_language as LANGUAGE_CODE %}
            {#   可用语言就是setting文件配置的元组 #}
            {% get_available_languages as LANGUAGES %}
            {#   获取可用语言详细信息字典#}
            {% get_language_info_list for LANGUAGES as languages %}
            {% for language in languages %}               {#  复选框默认为当前语言  #}
                <option value="{{ language.code }}" {% if language.code == LANGUAGE_CODE %} selected {% endif %}>
                     {{ language.name_local }} {{ language.code }}
                </option>
            {% endfor %}
        </select>
        <button type="submit" class="inline-block px-4 py-1.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out">{% trans "Switch" %}</button>
    </form>
</div>

{% block footer %}
    <footer class="text-center lg:text-left">
        <div class="text-center p-6 bg-gray-100">
            <span>{% translate "© 2025 Copyright:" %}</span>
            <a class="text-gray-600 font-semibold" href="https://blog.csdn.net/weixin_66526635?spm=1000.2115.3001.5343">{% translate "AI_magician" %}</a>
        </div>
    </footer>
{% endblock %}

</body>

</html>